<template>
  <div class="main_box">
    <CommonHeader title="重点关注任务"></CommonHeader>
    <!-- <div class="main_list" v-if="dataList.length"> -->
    <div style="height: 12px"></div>
    <pull-refresh-list ref="PullRefreshList" :limit="queryInfo.limit" :page-no.sync="queryInfo.page" :data.sync="dataList" @getList="initData">
      <div v-for="item in dataList" :key="item.index" class="declare_item" @click="toDetail(item)">
        <div class="content">
          <div class="tit">{{ item.title }}</div>
          <div style="display: flex; justify-content: space-between; margin-top: 6px">
            <div class="left">
              <img src="../../assets/image/green_tip.png" alt="" />
              <div>{{ item.greenCount }}</div>
              <img src="../../assets/image/red_tip.png" alt="" />
              <div>{{ item.redCount }}</div>
            </div>
            <div class="right">
              <div class="date">批示时间 {{ item.issueTime }}</div>
            </div>
          </div>
        </div>
      </div>
    </pull-refresh-list>
    <!-- </div> -->
    <div v-if="!dataList.length" class="main_list" style="color: #999">暂无数据</div>
  </div>
</template>

<script>
import CommonHeader from '@/components/commonHeader';
import PullRefreshList from '@/components/PullRefreshList';
// import feedbackMemberData from './mkFeedbackMember';

export default {
  // eslint-disable-next-line
  name: 'LeaderIndex',
  components: {
    CommonHeader,
    PullRefreshList,
  },
  data() {
    return {
      queryInfo: {
        page: 1,
        limit: 10,
      },
      dataList: [],
    };
  },
  computed: {
    formateState() {
      return function (state) {
        switch (state) {
          case '1':
            return '待反馈';
          default:
            return '已反馈';
        }
      };
    },
  },
  created() {},
  methods: {
    onSearch() {
      this.$refs.PullRefreshList.onSearch();
    },
    initData(callback) {
      console.log(1);
      this.$api
        .upLevelDutyList({
          ...this.queryInfo,
          employeeId: sessionStorage.getItem('employId'),
        })
        .then((res) => {
          if (res.status === 200) {
            callback(res.data.records);
          }
        });
      // const params = {
      //     _gp: "duties",
      //     _mt: "list",
      //     employId: sessionStorage.getItem('employId'),
      //     page: this.queryInfo.current,
      //     limit: this.queryInfo.size
      // }
      // this.$api.commonApi(params).then(res=>{
      //     if(res.errno === 200){
      //         const rows = res.data.items
      //         if (callback) callback(rows)
      //     }else{
      //         callback([])
      //     }
      // })
      // if (this.$route.query.isOK) {
      //   this.dataList = [];
      // } else {
      //   this.dataList = feedbackMemberData.sort((a, b) => +new Date(b.date) - +new Date(a.date));
      // }
    },
    toDetail(item) {
      this.$router.push({
        path: '/leaderFeedbackDetail',
        query: {
          ...item,
          id: item.id,
        },
      });
    },
  },
};
</script>

<style scoped>
.main_box {
  min-height: 100vh;
  background-color: #f4f5fa;
}
.main_list {
  width: 100%;
  min-height: calc(100vh - 105px);
  padding: 10px 15px;
  box-sizing: border-box;
}
.declare_item .content {
  width: 100%;
  padding: 10px;
  box-sizing: border-box;
  /* display: flex; */
  /* justify-content: space-between; */
  font-size: 14px;
  color: #333;
  cursor: pointer;
  background-color: #fff;
  /* border-radius: 8px; */
  margin-bottom: 15px;
}
.declare_item .content .left {
  display: flex;
}
.declare_item .content .left img {
  width: 18px;
  margin-left: 5px;
}
.declare_item .content .left div {
  margin-left: 5px;
}
.declare_item .content .left .date {
  height: 24px;
  line-height: 24px;
  font-size: 13px;
  color: #a3a7ad;
}
.declare_item .icon {
  width: 18px;
  height: 18px;
  background: url('../../assets/image/right_arrow.png') no-repeat;
  background-size: 100% 100%;
}
.declare_item * {
  cursor: pointer;
}

.declare_item .tit {
  font-size: 15px;
  margin-right: 15px;
  text-align: left;
}
</style>